#heal {
    position: absolute;
    left: 1.40%;
    bottom: 1.8%;
    width: 7%;
    height: 1%;
    padding: 0;
    border: 3px solid #333534;
    float:left;
    background:#747474;
}

#hunger {
    position: absolute;
    left: 1.381%;
    bottom: 0.35%;
    width: 4.5%;
    height: 1%;
    padding: 0;
    border: 3px solid #333534;
    float:left;
    background:#747474;
}

#thirst {
    position: absolute;
    left: 6%;
    bottom: 0.35%;
    width: 4.5%;
    height: 1%;
    padding: 0;
    border: 3px solid #333534;
    float:left;
    background:#747474;
}


#stamina {
    position: absolute;
    left: 8.3%;
    bottom: 1.8%;
    width: 7%;
    height: 1%;
    padding: 0;
    border: 3px solid #333534;
    float:left;
    background:#747474;
}

#oxygen {
    position: absolute;
    left: 10.6%;
    bottom: 0.35%;
    width: 4.7%;
    height: 1%;
    padding: 0;
    border: 3px solid #333534;
    float:left;
    background:#747474;
}

#boxHeal, #boxStamina, #boxHunger, #boxThirst, #boxOxygen {
    background: #439b46;
    width: 100%;
    height: 100%;
    transition: 0.2s ease-in-out;
}

#boxHunger {
    background: #439b46;
}
#boxThirst {
    background: #5562db;
}

#boxStamina {
    background: #7979e0;
}

#boxOxygen {
    background: #dad54b;
}

body {
    overflow: hidden;
    height:1080px;
    width:100%;
}